<template>
  <div id="app">
    <el-steps :active="active" finish-status="success">
        <el-step title="步骤 1"></el-step>
        <el-step title="步骤 2"></el-step>
        <el-step title="步骤 3"></el-step>
    </el-steps>
    <el-button type="primary"  @click="next">下一步</el-button>
    <router-view/>
  </div>
</template>

<script>
export default {
    name: 'App',
    data(){
        return {
            active: 1
        }
    },
    methods:{
        next() {
            this.active++
        }
    }
}
</script>

<style>
    *{
        margin:0;
        padding:0;
        list-style: none;
        box-sizing: border-box;
    }

    html,body{
        width:100%;
        height:100%;
        overflow: hidden;
    }

    #app{
        width:80%;
        margin:20px auto;
    }

    
</style>
